<template>
  <div class="home">
    <Swiper />

    <div class="bargain" @click="goBargainAll">
      <div class="bargain_nav">
        <p class="bargain_title">全民砍价
          <img src="../assets/icon/qianwang.png" alt=""></p> 
      </div>
      <div class="bargain_container">
        <Bargain />
      </div>
    </div>

    <div class="news">
      <div class="news_nav" @click="goNewsAll">
        <p class="news_title">精选专题
          <img src="../assets/icon/qianwang.png" alt=""></p> 
      </div>
      <div class="news_container">
        <News />
      </div>
    </div>

    <div class="goods">
      <div class="goods_nav" @click="goGoodsAll">
        <p class="goods_title">人气推荐
          <img src="../assets/icon/qianwang.png" alt=""></p> 
      </div>
      <div class="goods_container">
        <Goods />
      </div>
    </div>
  </div>
</template>

<script>
import PATH from '../router/constant'
import Swiper from '../components/home/Swiper'
import Bargain from '../components/home/Bargain'
import News from '../components/home/News'
import Goods from '../components/home/Goods'
export default {
  components: {
    Swiper, Bargain, News, Goods
  },
  data() {
    return {
    }
  },
  mounted() {
    
  },
  methods: {
    goBargainAll() {
      this.$router.push(PATH.BARGAINALL)
    },
    goNewsAll() {
      this.$router.push(PATH.NEWSALL)
    },
    goGoodsAll() {
      this.$router.push(PATH.GOODSALL)
    }
  },
  computed: {
    
  }
}
</script>

<style scoped>
.home {
  margin-bottom: 1.2rem;
  background-color: #eee;
}
.bargain {
  margin-top: 0.5rem;
  width: 100%;
  background-color: #fff;
}
.bargain_nav {
  padding: 0.01rem 0;
  border-bottom: 0.01rem solid #eee;
}
.bargain_title {
  font-size: 0.3rem;
  text-align: center;
}
.news {
  margin-top: 0.5rem;
  width: 100%;
  background-color: #fff;
}
.news_nav {
  padding: 0.01rem 0;
  border-bottom: 0.01rem solid #eee;
}
.news_title {
  font-size: 0.3rem;
  text-align: center;
}
.goods {
  margin-top: 0.5rem;
  width: 100%;
  background-color: #fff;
}
.goods_nav {
  padding: 0.01rem 0;
  border-bottom: 0.01rem solid #eee;
}
.goods_title {
  font-size: 0.3rem;
  text-align: center;
}
</style>